@extends('layouts.front.main_layout')
@if ($seo)
@section('title', $seo->meta_title)
@section('meta_keywords', $seo->meta_keywords)
@section('meta_description', $seo->meta_description)
@section('canonical_tag', $seo->canonical_tag)
@section('og_title', $seo->og_title ?? $seo->meta_title)
@section('og_description', $seo->og_description ?? $seo->meta_description)
@section('og_image', $seo->og_image)
@section('og_url', $seo->og_url ?? url()->current())
@section('twitter_card', $seo->twitter_card)
@section('twitter_title', $seo->twitter_title ?? $seo->meta_title)
@section('twitter_description', $seo->twitter_description ?? $seo->meta_description)
@section('twitter_image', $seo->twitter_image)
@endif
@section('content')
<section class="search-heading">
<div class="container">
<div class="row">
<div class="col-12">
<div class="search-heading">
<div>
<h6><a href="{{ route('website') }}">Home Page</a></h6>
</div>
<div class="search-heading-gap"></div>
<div>
<h6>Search</h6>
</div>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<div class="row">
<div class="col-md-2 d-none">
</div>
<div class="col-md-12">
<section class="car-cards">
<div class="row">
<div class="col-lg-3 col-md-12 col-sm-12 col-12 d-none">
<aside class="collapse show collapse-horizontal d-none d-lg-block"
id="collapseWidthExample">
<div class="products_filters">
<h5 class="heading">Filters</h5>
<div class="filter_content">
<div class="accordion" id="accordionExample">
<div class="accordion-item">
<h2 class="accordion-header" id="headingCity">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseCity"
aria-expanded="false" aria-controls="collapseCity">
City
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseCity" class="accordion-collapse collapse"
aria-labelledby="headingCity">
<div class="accordion-body">
<div class="search_check">
<div class="search_box">
<input class="icon-input__text-field" type="text"
placeholder="Search City">
<i class="icon-input__icon fas fa-search"></i>
</div>
<div class="brand_checkbox">
<form>
<div class="form-group">
<input type="checkbox" id="city1">
<label for="city1">Chandigarh</label>
</div>
<div class="form-group">
<input type="checkbox" id="city2">
<label for="city2">Mohali</label>
</div>
<div class="form-group">
<input type="checkbox" id="city3">
<label for="city3">Panchkula</label>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseOne"
aria-expanded="false" aria-controls="collapseOne">
Brand
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse"
aria-labelledby="headingOne">
<div class="accordion-body">
<div class="search_check">
<div class="search_box">
<input class="icon-input__text-field" type="text"
placeholder="e.g. Mahindra, Honda">
<i class="icon-input__icon fas fa-search"></i>
</div>
<div class="brand_checkbox">
<form>
<div class="form-group">
<input type="checkbox" id="mahindra">
<label for="mahindra">Mahindra</label>
</div>
<div class="form-group">
<input type="checkbox" id="marutisuzuki">
<label for="marutisuzuki">Maruti
Suzuki</label>
</div>
<div class="form-group">
<input type="checkbox" id="hyundai">
<label for="hyundai">Hyundai</label>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingModal">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseModal"
aria-expanded="false" aria-controls="collapseModal">
Modal
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseModal" class="accordion-collapse collapse"
aria-labelledby="headingModal">
<div class="accordion-body">
<div class="search_check">
<div class="search_box">
<input class="icon-input__text-field" type="text"
placeholder="e.g. Mahindra, Honda">
<i class="icon-input__icon fas fa-search"></i>
</div>
<div class="brand_checkbox">
<form>
<div class="form-group">
<input type="checkbox" id="mahindrasuv">
<label for="mahindrasuv">Mahindra
Suv</label>
</div>
<div class="form-group">
<input type="checkbox" id="mahindrasuv1">
<label for="mahindrasuv1">Mahindra
Suv</label>
</div>
<div class="form-group">
<input type="checkbox" id="mahindrasuv2">
<label for="mahindrasuv2">Mahindra
Suv</label>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingTwo">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseTwo"
aria-expanded="false" aria-controls="collapseTwo">
Body Type
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseTwo" class="accordion-collapse collapse"
aria-labelledby="headingTwo">
<div class="accordion-body">
<div class="body_grid">
<button class="btn active">Hatchback</button>
<button class="btn">Sedan</button>
<button class="btn">SUV</button>
<button class="btn">MUV</button>
<button class="btn">Crossover</button>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingThree">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseThree"
aria-expanded="false" aria-controls="collapseThree">
Manufacturer Year
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseThree" class="accordion-collapse collapse"
aria-labelledby="headingThree">
<div class="accordion-body">
<div class="body_grid">
<button class="btn active">2015 And Newer</button>
<button class="btn">2016 And Newer</button>
<button class="btn">2017 And Newer</button>
<button class="btn">2018 And Newer</button>
<button class="btn">2019 And Newer</button>
<button class="btn">2020 And Newer</button>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingFour">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseFour"
aria-expanded="false" aria-controls="collapseFour">
Fuel Type
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseFour" class="accordion-collapse collapse"
aria-labelledby="headingFour">
<div class="accordion-body">
<div class="body_grid">
<button class="btn active">Petrol</button>
<button class="btn">Petrol+CNG</button>
<button class="btn">Diesel</button>
<button class="btn">Electric</button>
<button class="btn">Hybrid</button>
<button class="btn">Petrol+LPG</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</aside>
<button class="btn btn-outline-secondary" type="button" data-bs-toggle="offcanvas"
data-bs-target="#offcanvasExample" aria-controls="offcanvasExample" id="sidebarshow">
<i class="fas fa-filter"></i> Filter
</button>
<div class="offcanvas offcanvas-start" data-bs-scroll="true" tabindex="-1"
id="offcanvasExample" aria-labelledby="offcanvasExampleLabel">
<div class="offcanvas-body">
<div class="products_filters">
<h5 class="heading d-flex align-items-center justify-content-between">
Filters
<button type="button" class="btn-close" data-bs-dismiss="offcanvas"
aria-label="Close"><i class="fas fa-times"></i></button>
</h5>
<div class="filter_content">
<div class="accordion" id="accordionExample">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseOne"
aria-expanded="false" aria-controls="collapseOne">
Brand+Modal
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse"
aria-labelledby="headingOne">
<div class="accordion-body">
<div class="search_check">
<div class="search_box">
<input class="icon-input__text-field"
type="text"
placeholder="e.g. Mahindra, Honda">
<i class="icon-input__icon fas fa-search"></i>
</div>
<div class="brand_checkbox">
<form>
<div class="form-group">
<input type="checkbox" id="mahindra1">
<label for="mahindra1">Mahindra</label>
</div>
<div class="form-group">
<input type="checkbox" id="marutisuzuki1">
<label for="marutisuzuki1">Maruti
Suzuki</label>
</div>
<div class="form-group">
<input type="checkbox" id="hyundai1">
<label for="hyundai1">Hyundai</label>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingTwo">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseTwo"
aria-expanded="false" aria-controls="collapseTwo">
Body Type
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseTwo" class="accordion-collapse collapse"
aria-labelledby="headingTwo">
<div class="accordion-body">
<div class="body_grid">
<button class="btn active">Hatchback</button>
<button class="btn">Sedan</button>
<button class="btn">SUV</button>
<button class="btn">MUV</button>
<button class="btn">Crossover</button>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingThree">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseThree"
aria-expanded="false" aria-controls="collapseThree">
Manufacturer Year
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseThree" class="accordion-collapse collapse"
aria-labelledby="headingThree">
<div class="accordion-body">
<div class="body_grid">
<button class="btn active">2015 And Newer</button>
<button class="btn">2016 And Newer</button>
<button class="btn">2017 And Newer</button>
<button class="btn">2018 And Newer</button>
<button class="btn">2019 And Newer</button>
<button class="btn">2020 And Newer</button>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headingFour">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapseFour"
aria-expanded="false" aria-controls="collapseFour">
Fuel Type
<span class="icon-toggle icon-togglePlus">+</span>
<span class="icon-toggle icon-toggleMinus">-</span>
</button>
</h2>
<div id="collapseFour" class="accordion-collapse collapse"
aria-labelledby="headingFour">
<div class="accordion-body">
<div class="body_grid">
<button class="btn active">Petrol</button>
<button class="btn">Petrol+CNG</button>
<button class="btn">Diesel</button>
<button class="btn">Electric</button>
<button class="btn">Hybrid</button>
<button class="btn">Petrol+LPG</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="row d-none">
<div class="col-12">
<div class="sort_row">
<div class="search">
<div class="search_box">
<input class="icon-input__text-field" type="text"
placeholder="e.g. Mahindra, Honda">
<i class="icon-input__icon fas fa-search"></i>
</div>
</div>
<div class="sort_vehicle">
<div class="dropdown">
<button class="dropdown-button"><i class="fas fa-sort"></i>
Sort</button>
<div class="dropdown-content">
<a href="#"><i class="fas fa-sort"></i> Price: High to
Low</a>
<a href="#"><i class="fas fa-sort"></i> Price: Low to
High</a>
<a href="#"><i class="fas fa-sort"></i> Latest</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div
class="vehicle_switchTabs style-skew-1 text-start d-flex justify-content-center align-items-center">
<button class="btn activeTab_btn" data-target="passenger">
<span>Passenger Transport</span>
</button>
<button class="btn" data-target="cargo">
<span>Cargo Transport</span>
</button>
</div>
</div>
</div>
<div class="row">
<div class="vehicle_filter passenger_vehicle_filter" style="display: none">
<label>Seating Capacity:</label>
<select class="form-control" name="seating_capacity" id="seating_capacity">
<option value="" selected disabled>Select option</option>
@foreach(\App\Models\Vehicles::passengerSeatingCapacityOptions() as $value => $label)
<option value="{{ $value }}">{{ $label }}</option>
@endforeach
</select>
</div>
</div>
<div class="row">
<div class="vehicle_filter cargo_vehicle_filter" style="display: none">
<label>Weight Capacity:</label>
<select name="weight_capacity" class="form-control" id="weight_capacity">
<option value="" selected disabled>Select option</option>
@foreach(\App\Models\CargoVehicle::goodsTransportCapacityOptions() as $value => $label)
<option value="{{ $value }}">{{ $label }}</option>
@endforeach
</select>
</div>
</div>
<div class="row passenger_vehicles" id="vehicle-list" style="display: flex">
</div>
<div class="row cargo_vehicles" id="cargo_vehicle_list" style="display: none">
{{-- <div class="col-lg-4 col-md-6 col-sm-12 col-12">
<div class="car-wrap">
<div class="position-relative">
<div class="car-wrap-image-1">
<img src="{{ asset('assets/front/website/img/blog-s-1-5-1-1.jpg') }}"
alt="Vehicle Image">
</div>
</div>
<div class="car-types">
<div class="car-models">
<div class="arrow-icon-1">
<i class="fas fa-angle-up"></i>
</div>
<div class="arrow-icon">
<i class="fas fa-angle-down"></i>
</div>
<form action="">
<div class="form-check">
<input type="radio" class="form-check-input car-model-radio"
id="radio54" name="optradio" value="54"
data-make="Tata Motors" data-model="Altroz Turbo"
data-vehicle_type_id="2" data-fuel_type="Patrol"
data-transmission_type="Manual" data-seating_capacity="4"
data-service_type="Passenger" data-viewcontactdetails="54"
data-modal="54" data-vehicle_id="54"
data-transporter_id="25" checked="">
<label class="form-check-label" for="radio54">
Altroz Turbo
</label>
</div>
<div class="form-check">
<input type="radio" class="form-check-input car-model-radio"
id="radio53" name="optradio" value="53"
data-make="Tata Motors" data-model="Altroz DCT"
data-vehicle_type_id="1" data-fuel_type="CNG"
data-transmission_type="Manual" data-seating_capacity="4"
data-service_type="Passenger" data-viewcontactdetails="53"
data-modal="53" data-vehicle_id="53"
data-transporter_id="25">
<label class="form-check-label" for="radio53">
Altroz DCT
</label>
</div>
</form>
</div>
<div class="car-details">
<span class="admin_name text-dark">
<img src="{{ asset('assets/front/website/img/blog-s-1-5-1-1.jpg') }}"
alt="Vehicle Image">
Tested
</span>
<div class="car-details-item" id="car-details-container-13"
data-model-id="8">
<div class="car-details-heading">
<h5>Tata Motors</h5>
<p class="details-sub-heading">SUV</p>
</div>
<div class="car-details-text">
<img src="{{ asset('assets/front/website/img/fuel.png') }}"
alt="...">
<span class="right-details-fuel">Patrol</span>
</div>
<br>
<div class="car-details-text">
<img src="{{ asset('assets/front/website/img/steering-wheel (1).png') }}"
alt="...">
<span class="right-details-transmission">Manual</span>
</div>
<br>
<div class="car-details-text">
<img src="{{ asset('assets/front/website/img/car-seat.png') }}"
alt="...">
<span class="right-details-seating">4 seater </span>
</div>
<br>
<div class="car-details-text">
<img src="{{ asset('assets/front/website/img/transport copy.png') }}"
alt="...">
<span class="car-details-servicetype">Passenger</span>
</div>
<br>
<br>
<div
class="details-button text-start d-flex justify-content-between align-items-center">
<button class="btn style-skew-1 contactdetails" data-id="54"
data-transporter-id="25">
<span>Contact Now</span>
</button>
</div>
<a href="#" class="openReportModal userInfo_img"
data-bs-toggle="modal" data-bs-target="#userReport">
<img src="{{ asset('assets\front\website\img\userinfo.png') }}"
alt="Reported User" width="30"
style="cursor: pointer,margin-top:300px">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="userReport" tabindex="-1"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Report a User</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-12">
<!-- Display success message -->
<!-- Display validation errors -->
<form action="http://127.0.0.1:8000/report-user"
method="Post" class="data-form" id="userRequest"
enctype="multipart/form-data" novalidate="novalidate">
<input type="hidden" name="_token"
value="E97Dhwbx63ehiNBbwUJeBvbd9YcHFfSdaVuaKuLG"
autocomplete="off">
<div class="row g-3">
<div class="col-md-12">
<input type="text"
class="form-control form-0" id="name"
name="name"
placeholder="Your Name (Optional)">
</div>
<div class="col-md-12">
<input type="text"
class="form-control form-0" id="email"
name="email"
placeholder="Email Address (Optional)">
</div>
<div class="col-md-12">
<input type="text"
class="form-control form-0"
id="transporter_name"
name="transporter_name"
placeholder="Transporter Name"
required="">
</div>
<div class="col-md-12">
<input type="file"
class="form-control form-0"
id="reported_user_image"
name="reported_user_image"
placeholder="Upload File.."
required="">
</div>
<div class="col-12">
<textarea class="form-control form-0" id="reason" name="reason" rows="4" placeholder="Reason..."
required=""></textarea>
</div>
<div class="col-12">
<div class="row">
<div class="submit-grp">
<button type="submit"
class="btn fw-bold w-100 style-skew"><span>
Submit Report
</span></button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<ul class="pagination" id="pagination-links">
<li class="page-item disabled">
<a class="page-link" href="#" data-page="0"><i
class="fas fa-arrow-left"></i></a>
</li>
<li class="page-item active">
<a class="page-link" href="#" data-page="1">1</a>
</li>
<li class="page-item disabled">
<a class="page-link" href="#" data-page="2"><i
class="fas fa-arrow-right"></i></a>
</li>
</ul>
<div class="loader-main" style="display: none;">
<div class="loader">
<img src="favicon.ico" alt="Loading.." style="width: 40px; height: 40px;">
</div>
</div> --}}
</div>
</div>
</div>
<div class="col-12 mb-3">
<nav>
</nav>
</div>
</section>
</div>
</div>
</div>
</section>
{{-- let's ride now popup --}}
<div class="modal fade orbicontactdetails" id="orbi-contactdetails" tabindex="-1"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Contact Details</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="container">
<div class="row">
<form action="{{ route('leadslisting.store') }}" method="Post" class="data-form"
id="taxiBookingForm">
<small class="mb-3 d-block">We request your contact details to maintain authenticity and
offer you reliable business information.</small>
@csrf
@csrf
<div class="row g-3">
<div class="col-md-6">
<input type="hidden" id="transporter_id" name="transporter_id" value="">
<input type="hidden" id="vehicle_id" name="vehicle_id" value="">
<input type="text" class="form-control form-0" id="your_name"
name="your_name" placeholder="Your Name">
</div>
<div class="col-md-6">
<input type="text" class="form-control form-0 contact-info" id="your_number"
name="your_number" placeholder="Phone Number">
</div>
<div class="col-md-6">
<input type="text" class="form-control form-0 contact-info" id="your_email"
name="your_email" placeholder="Email Address">
</div>
<div class="col-12">
<div class="row">
<div class="submit-grp d-flex flex-row-reverse">
<button type="submit" class="btn fw-bold w-30 style-skew vehicle_info"
id="vehicle_info_button" data-id="">
<span>View Contact</span>
</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- end let's ride now popup --}}
{{-- modal --}}
<div class="modal fade orbimodal orbi-viewcontactdetails" id="orbi-viewcontactdetails" tabindex="-1"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">View Contact Details</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
</div>
</div>
</div>
</div>
{{-- <section class="form-section">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-12 col-sm-12 col-12">
<div class="form-text">
<img src="{{ asset('assets/front/website/img/title_shape_1_1.svg') }}" alt="..."><span
class="span">TAXI BOOKING FORM</span>
<h2>Book Your Taxi Online</h2>
<p>Taxis can be hailed from any location and at any time. Maintain optimal business competitive
products grow strategic and technically sound human capital distributed.</p>
<div class="form-text-information">
<div class="form-text-icon">
<i class="fas fa-phone-alt"></i>
</div>
<div class="form-text-detail">
<p style="color: white;">call for book an order:</p>
@if (isset($website_phone_number) && $website_phone_number)
<span class="dark-text"> (+91) {{ $website_phone_number }}</span>
@else
<span class="dark-text"> (+91)0987654321</span>
@endif
</div>
</div>
<div class="information-text">
<p>You Get Call Back Soon...</p>
</div>
</div>
</div>
<div class="col-lg-6 col-md-12 col-sm-12 col-12">
<form class="data-form">
<h2>Book Taxi Now</h2>
<div class="row g-3">
<div class="col-md-6">
<input type="text" class="form-control form-0" id="your-name" name="your-name"
placeholder="Your Name" required>
</div>
<div class="col-md-6">
<input type="text" class="form-control form-0" id="" name="your-number"
placeholder="Phone Number" required>
</div>
<div class="col-md-12">
<input type="text" class="form-control form-0" id="you-email" name="your-email"
placeholder="Email Address" required>
</div>
<div class="col-md-6">
<select class="form-select form-control form-0" aria-label="Default select example">
<option selected>Vehicle Type</option>
<option value="1">Sedan</option>
<option value="2">Hatchback</option>
<option value="3">SUV</option>
<option value="3">MPV</option>
<option value="3">VAN</option>
<option value="3">BUS</option>
</select>
</div>
<div class="col-md-6">
<input type="text" class="form-control form-0" id="passenger" name="passenger"
placeholder="Number of Passenger" required>
</div>
<div class="col-md-6">
<input type="text" class="form-control form-0" id="pickup" name="pickup"
placeholder="Pickup" required>
</div>
<div class="col-md-6">
<input type="text" class="form-control form-0" id="drop" name="drop"
placeholder="Drop" required>
</div>
<div class="col-md-12">
<input id="datetimepicker2" type="text" class="form-control form-0"
placeholder="Date & Time" required>
</div>
<div class="col-12">
<textarea class="form-control form-0" id="your-message" name="your-message" rows="4"
placeholder="Description..." required></textarea>
</div>
<div class="col-12">
<div class="row">
<div class="submit-grp">
<button type="submit" class="btn fw-bold w-100 style-skew"><span>BOOK TAXI
NOW</span></button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</section> --}}
@endsection
<script>
const accordions = document.querySelectorAll('.accordion-collapse');
accordions.forEach(collapseEl => {
collapseEl.addEventListener('show.bs.collapse', function() {
const button = document.querySelector(`[data-bs-target="#${this.id}"]`);
const icon = button.querySelector('.icon-toggle');
icon.textContent = '−';
});
collapseEl.addEventListener('hide.bs.collapse', function() {
const button = document.querySelector(`[data-bs-target="#${this.id}"]`);
const icon = button.querySelector('.icon-toggle');
icon.textContent = '+';
});
});
</script>